<template>
	<view class="page">
		<view>
			<u-navbar :autoBack="true" bgColor="#252928" safeAreaInsetTop placeholder="true">
				<view style="display: flex;" class="u-nav-slot" slot="left">
					<u-icon color="#ffffff" name="arrow-left" size="19"></u-icon>
					<view style="font-size: 36rpx;margin-left: 20rpx;">账号与安全</view>

				</view>
			</u-navbar>
		</view>
		<u-cell-group>
			<view class="ingo-cell" @click="Gosetphone">
				<u-cell style="pointer-events: none ; margin-top: 8rpx;" :titleStyle="titleStyle"
					:rightIconStyle="rightIconStyle" size="large" title="手机号" :value="info.phone | formatNum" isLink
					:border="false"></u-cell>


			</view>
			<view class="ingo-cell">
				<u-cell style="pointer-events: none ; margin-top: 8rpx; padding-right: 30rpx;" :titleStyle="titleStyle"
					:rightIconStyle="rightIconStyle" size="large" title="支付宝账号" :value="info.phone | formatNum"
					:border="false"></u-cell>


			</view>
			<view class="ingo-cell" style="position: relative;" @click="Setrealname">
				<u-cell style="pointer-events: none ; margin-top: 8rpx;" :titleStyle="titleStyle"
					:rightIconStyle="rightIconStyle" size="large" title="实名认证" :value="info.attestation" isLink
					:border="false">
					<!-- 已认证 -->

				</u-cell>
				<view style="position: absolute; top: 40rpx ;left: 523rpx; display: flex;" v-if="badge2"  slot="value" class="u-slot-value">
					<u-icon name="checkbox-mark" color="#11ff11" size="20"></u-icon>
					<view style="color:#606266 ;">已认证</view>
				</view>
				<u-badge :show="badge" :isDot="true" type="error"></u-badge>

			</view>
			<view class="ingo-cell" style="position: relative;" @click="Gopass">
				<u-cell style="pointer-events: none ; margin-top: 8rpx;" :titleStyle="titleStyle"
					:rightIconStyle="rightIconStyle" size="large" title="操作密码" :value="info.password" isLink
					:border="false"></u-cell>
				<u-badge :show="badge1" :isDot="true" type="error"></u-badge>

			</view>

		</u-cell-group>
		<!-- <u-popup :show="show" mode="center" :round="10" bgColor="#1e201f"  >
			        <view class="info-name" style="width: 600rpx;">
			            <view style="margin-top: 10rpx; height: 80rpx ;line-height: 80rpx; text-align: center;font-weight: 600;">
			            	确认要退出登录吗
			            </view>
						
						<view class="" style="border-top: 1px solid #353938;margin-top: 40rpx; display: flex;" >
							<view  @click="close(2)" class="" style="width: 50%; text-align: center;height: 100rpx; line-height: 100rpx; border-right: 1px solid #353938;">
								取消
							</view>
							<view @click="confirm" class="" style="color:#9f444a ; width: 50%; text-align: center;height: 100rpx; line-height: 100rpx;">
								退出登录
							</view>
						</view>
			        </view>
				</u-popup> -->
	</view>
</template>

<script>
	export default {
		data() {
			return {
				badge: 1,//两个红点的控制
				badge1: 1,//两个红点的控制
				badge2: 0,//已认证的控制

				info: {
					"ZFB": "12345678910",
					"phone": "12345678910",
					"attestation": "未认证",
					"password": "未设置"
				},
				titleStyle: {
					color: '#ffffff',


				},
				rightIconStyle: {
					color: '#626463'
				},
			}
		},
		filters: {
			formatNum(num) {
				// 手机
				return num.replace(/^(\d{3})\d{6}(\d+)/, "$1******$2")
			}
		},
		methods: {
			Gosetphone() {
				uni.navigateTo({
					url: '../SetPhone/SetPhone'
				})
			},
			Setrealname() {
				uni.navigateTo({
					url: '../realname/realname'
				})
			},
			Gopass() {
				uni.navigateTo({
					url: '../password/password'
				})
			}

		}
	}
</script>

<style scoped>
	.ingo-cell {
		height: 120rpx;
		background-color: #3c3f3d;
		border-radius: 25rpx;
		width: 95%;
		margin: 0px auto;
		margin-top: 50rpx;
		box-sizing: border-box;
		padding-top: 15rpx;
	}

	>>>.u-line {
		border: none !important;
	}

	>>>.u-badge--error {
		position: absolute;
		top: 40rpx;
		left: 160rpx;
	}

	>>>.u-cell--clickable {
		background-color: #3c3f3d !important;
		border-radius: 50rpx;

	}
</style>
